let leftList = document.querySelector(".listSearch .search .left");
for (let i = 0; i < leftList.children.length; i++) {
    leftList.children[i].onmouseenter = function () {
        for (let i = 0; i < leftList.children.length; i++) {
            leftList.children[i].style.backgroundColor = "#fff";
        }
        this.style.backgroundColor = "#eee"
    }
}
// 列表功能
let sqsx = document.querySelector(".phoneMessage .middle .right");
let down = document.querySelector(".phoneMessage .down");
let idx = 0;
sqsx.onclick = function () {
    if (idx === 0) {
        down.style.display = "none";
        sqsx.innerHTML = "显示筛选";
        idx = 1;
    } else {
        down.style.display = "block";
        sqsx.innerHTML = "隐藏筛选";
        idx = 0;
    }

}
let checkmores = document.querySelectorAll(".down .content .select");
for (let i = 0; i < checkmores.length; i++) {
    checkmores[i].onclick = function () {
        let sq = this.parentNode.lastElementChild;
        let content = this.parentNode;
        let box = this.previousElementSibling;
        let ul = box.firstElementChild;
        let inputs = ul.querySelectorAll("input");
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].style.display = "block";
            inputs[i].style.float = "left";
            inputs[i].style.marginRight = "10px";
            inputs[i].flag = true;
            inputs[i].onmouseenter = function () {
                if (!this.flag) return;
                this.checked = "true";
            }
            inputs[i].onclick = function () {
                if (this.flag) {
                    this.checked = "true";
                    this.flag = false;
                } else {
                    this.flag = true;
                    this.checked = "";
                }
            }
            inputs[i].onmouseleave = function () {
                if (this.flag) {
                    this.checked = "";
                } else {
                    this.checked = "true";
                }
            }
        }
        content.style.height = ul.offsetHeight + "px";
        ul.style.height = ul.offsetHeight - 42 + "px";
        ul.style.overflow = "auto";
        this.style.display = "none";
        // sq.innerHTML = "收起";
        // sq.onclick = function () {
        // }
    }
}

// 搜索框吸顶效果
let oul = document.querySelector(".imgList ul");
let listSearch = document.querySelector(".listSearch");
window.onscroll = function () {
    if (document.documentElement.scrollTop >= 105) {
        listSearch.style.position = "fixed";
        listSearch.style.zIndex = "9";
        listSearch.style.top = "0";
        listSearch.style.left = "14.5%";
    } else {
        listSearch.style.position = "static";
    }
};

// ajax请求数据 
//  ./json/goods.json
// const imgUl = document.querySelector(".imgList ul");
// const sellUl = document.querySelector(".sell ul");
// window.onload = function () {
//     const xhr = new XMLHttpRequest();
//     xhr.open("get", "./json/goods.json");
//     xhr.send();
//     xhr.onload = function () {
//         if (xhr.status >= 200 && xhr.status < 300) {
//             let data = JSON.parse(xhr.response);
//             for (let j = 0; j < data.length; j++) {
//                 let imgLi = document.createElement("li");
//                 imgLi.innerHTML = `
//                                     <img src=${data[j].img} >
//                                     <div class="price"> &yen; ${data[j].price}</div>
//                                     <div class="text">${data[j].title}</div>
//                                 `
//                 imgUl.appendChild(imgLi)
//             }

            // 掌柜热卖
            // for (let j = 0; j < 6; j++) {
            //     let sellLi = document.createElement("li");
            //     sellLi.innerHTML = `
            //                         <img src=${data[j].img} >
            //                         <div class="price"> &yen; ${data[j].price}</div>
                                   
            //                     `
            //     sellUl.appendChild(sellLi)
            // }

            // 排序功能
            // ; (function () {
            //     const sx = document.querySelector(".sort ul li ol .sx");
            //     const dx = document.querySelector(".sort ul li ol .dx");
            //     const ipt1 = document.querySelector(".sort ul li .ipt1");
            //     const ipt2 = document.querySelector(".sort ul li .ipt2");
            //     const obtn = document.querySelector(".sort ul li button");
            //     渲染页面
            //     function render(data){
            //         let str="";
            //         data.forEach(val => {
            //            str += `
            //                     <li>
            //                         <img src=${val.img} >
            //                         <div class="price"> &yen; ${val.price}</div>
            //                         <div class="text">${val.title}</div>
            //                     </li>
            //                   ` 
            //         });
            //         return str;
            //     }
            //     价格从低到高
            //     sx.onclick=function(){
            //         data.sort((a,b) => {
            //            return  parseInt(a.price)-parseInt(b.price); 
            //         });
            //         imgUl.innerHTML=render(data);    
            //     };
            //     价格从高到低
            //     dx.onclick=function(){
            //         data.sort((a,b) => {
            //            return  parseInt(b.price)-parseInt(a.price); 
            //         });
            //         imgUl.innerHTML=render(data);    
            //     };
            //     价格区间筛选
            //     obtn.onclick=function(){
            //         if(ipt1.value === ""){
            //             ipt1.style.backgroundColor="red";return;
            //         }else if(ipt2.value === ""){
            //             ipt2.style.backgroundColor="red";return; 
            //         }
            //         let newdata = data.filter((val)=>{
            //             return parseFloat(val.price) >= ipt1.value && parseFloat(val.price) <= ipt2.value
            //         })
            //         imgUl.innerHTML=render(newdata);  
            //     };
            //     ipt1.onfocus=function(){
            //         ipt1.style.backgroundColor="#ffffff";
            //     };
            //     ipt2.onfocus=function(){
            //         ipt2.style.backgroundColor="#ffffff";
            //     };

                
            // })();
//         }
//     }
// };











